<template>
    <a-drawer :title="title" width="31%" destroyOnClose :visible="visible" @close="() => {
        this.visible = false
    }
        ">
        <a-spin :spinning="confirmLoading">
            <a-form-model ref="form" :model="entity" :rules="rules" v-bind="layout">
                <a-row>
                    <a-col span="22">

                        <a-form-model-item label="类型" prop="TypeName" :labelCol="{ style: 'width: 20%;float:left;' }">
                            <a-select v-model="entity.TypeName" default-value="" @change="handleChange">
                                <a-select-option value="区域">
                                    区域
                                </a-select-option>
                                <a-select-option value="专业">
                                    专业
                                </a-select-option>
                                <a-select-option value="问题">
                                    问题
                                </a-select-option>
                            </a-select>
                        </a-form-model-item>
                        <a-form-model-item label="名称" prop="Text" :labelCol="{ style: 'width: 20%;float:left;' }">
                            <a-input v-model="entity.Text" autocomplete="off" />
                        </a-form-model-item>
                        <a-form-model-item label="排序" prop="Sort">
                            <a-input v-model="entity.Sort" autocomplete="off" />
                        </a-form-model-item>



                    </a-col>
                </a-row>
            </a-form-model>
        </a-spin>
        <div :style="{
            position: 'absolute',
            right: 0,
            bottom: 0,
            width: '100%',
            borderTop: '1px solid #e9e9e9',
            padding: '5px 16px',
            background: '#fff',
            textAlign: 'right',
            zIndex: 1
        }">
            <a-button @click="close">返回</a-button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a-button type="primary" @click="handleSubmit">保存</a-button>
        </div>
    </a-drawer>
</template>

<script>
export default {
    components: {
    },
    props: {
        parentObj:{
            type:Object,
            require:true,
        }
    },
    data() {
        return {
            layout: {
                labelCol: { span: 5 },
                wrapperCol: { span: 18 }
            },
            visible: false,
            confirmLoading: false,
            entity: {},
            title: '',
            rules: {},
        }
    },
    methods: {
        handleChange(value) {
            console.log(`selected ${value}`);
        },
        close() {
            this.visible = false
            this.entity = {}

        },

        init() {
            this.visible = true
            this.entity = {}
        },
        openForm(id, title) {
            this.init()
            this.title = title
            if (id) {
                this.$http.post('/Base_ProjectWork/Base_TakeNotesType/GetTheData', { id: id }).then(resJson => {
                    this.entity = {}
                    setTimeout(() => {
                        this.entity = resJson.Data
                        // console.log(this.entity.Sort);
                    }, 1)
                })
            }
        },
        // 保存提交数据库
        handleSubmit() {
            this.loading = true
            this.$http.post('/Base_ProjectWork/Base_TakeNotesType/SaveData', this.entity).then(resJson => {
                if (resJson.Success) {
                    this.$message.success('操作成功!')
                    this.loading = false
                    this.visible = false
                    this.parentObj.getDataList()

                } else {
                    this.$message.error(resJson.Msg)
                    this.loading = false
                }
            })
        },

    }
}
</script>
